<template>
	<view class="release_task">
		<!-- 标题 -->
		<title-component titleName="创建任务" :isShowMore="false" :isShowBtn="false"></title-component>
		<!-- 表单 -->
		<view class="release_task_form">
			<u--form :model="taskInfo" ref="taskForm" :rules="rules" :labelStyle="labelStyle">
				<u-form-item label="任务名称" prop="taskName" borderBottom labelWidth="auto">
					<u--input v-model="taskInfo.taskName" border="none" placeholder="请输入任务名称"></u--input>
				</u-form-item>
				<u-form-item label="任务类型" prop="claimMethod" borderBottom labelWidth="auto">
					<u-radio-group v-model="taskInfo.claimMethod">
						<u-radio label="单人任务" activeColor="var(--echo-main-color)" :name="0"></u-radio>
						<u-radio label="多人任务" activeColor="var(--echo-main-color)" style="margin-left: 40rpx;"
							:name="1">
						</u-radio>
					</u-radio-group>
				</u-form-item>
				<u-form-item label="奖励币种" prop="ccy" borderBottom labelWidth="auto">
					<u-radio-group v-model="taskInfo.ccy">
						<u-radio :label="ccyName" activeColor="var(--echo-main-color)" :name="ccy"></u-radio>
						<u-radio label="原力" activeColor="var(--echo-main-color)" style="margin-left: 40rpx;"
							:name="'fc'"></u-radio>
					</u-radio-group>
				</u-form-item>
				<u-form-item label="激励金额" prop="incentiveAmount" borderBottom labelWidth="auto">
					<u--input v-model="taskInfo.incentiveAmount" border="none" type="number" placeholder="请输入激励金额">
					</u--input>
				</u-form-item>
				<u-form-item label="开始时间" prop="startTime" borderBottom labelWidth="auto" @click="startTimeShow = true">
					<u--input v-model="taskInfo.startTime" border="none" placeholder="请选择开始时间" disabled
						style="background-color: #fff;">
					</u--input>
				</u-form-item>
				<u-form-item label="结束时间" prop="endTime" borderBottom labelWidth="auto" @click="endTimeShow = true">
					<u--input v-model="taskInfo.endTime" border="none" placeholder="请选择结束时间" disabled
						style="background-color: #fff;">
					</u--input>
				</u-form-item>
				<u-form-item prop="description" labelWidth="auto">
					<u--textarea placeholder="请输入任务描述" v-model="taskInfo.description"></u--textarea>
				</u-form-item>
			</u--form>
			<u-button text="创建" color="var(--echo-main-color)" class="toCreate" @tap="submit"></u-button>
		</view>
		<u-datetime-picker :show="startTimeShow" v-model="startTime" mode="date" @confirm="selectStartTime"
			@cancel="startTimeShow = false">
		</u-datetime-picker>
		<u-datetime-picker :show="endTimeShow" v-model="endTime" mode="date" @confirm="selectEndTime"
			@cancel="endTimeShow = false">
		</u-datetime-picker>
	</view>
</template>

<script>
	import {
		createTask
	} from '@/config/taskApi.js';
	export default {
		data() {
			return {
				// form的样式
				labelStyle: {
					marginRight: '40rpx'
				},
				ccy: '',
				ccyName: '',
				// 表单数据
				taskInfo: {
					taskName: '',
					incentiveAmount: '',
					description: '',
					// 用户标识
					customerNo: '',
					// 币种
					ccy: '',
					// 任务类型,单人多人
					claimMethod: 0,
					// 任务类型 个人任务
					type: 0,
					startTime: '',
					endTime: ''
				},
				// 开始时间
				startTime: Number(new Date()),
				// 结束时间
				endTime: Number(new Date()),
				// 控制日期选择框
				// 开始时间
				startTimeShow: false,
				// 结束时间
				endTimeShow: false,
				// 验证规则
				rules: {
					taskName: [{
						required: true,
						message: "请填写任务名"
					}],
					claimMethod: [{
						required: true,
						message: "请选择任务类型"
					}],
					ccy: [{
						required: true,
						message: "请选择币种"
					}],
					incentiveAmount: [{
						required: false
					}],
					description: [{
						required: false
					}],
				},
			}
		},
		created() {
			// 用于创建任务
			this.taskInfo.customerNo = uni.getStorageSync('customerNo')
			this.ccy = getApp().globalData.ccy
			this.ccyName = getApp().globalData.ccyName
		},

		methods: {
			// 选择开始时间
			selectStartTime(dataTime) {
				this.taskInfo.startTime = uni.$u.timeFormat(dataTime.value, 'yyyy-mm-dd')
				this.startTimeShow = false
			},
			selectEndTime(dataTime) {
				this.taskInfo.endTime = uni.$u.timeFormat(dataTime.value, 'yyyy-mm-dd')
				this.endTimeShow = false
			},
			// 提交
			async submit() {
				// 表单验证
				let validationRes = await this.$refs.taskForm.validate()
				console.log('this.taskInfo', this.taskInfo)
				// 创建任务接口
				let createTaskRes = await createTask({
					...this.taskInfo
				})
				console.log('createTaskRes', createTaskRes)
				if (createTaskRes.code === "000000") {
					uni.showToast({
						icon: 'success',
						position: 'bottom',
						title: '创建成功'
					});
					setTimeout(function() {
						uni.navigateTo({
							url: "/pages/my/myTask"
						})
					}, 1000)
					// 重置表单
					this.$refs.taskForm.resetFields()
				}
			},
		}
	}
</script>

<style lang="scss">
	.release_task {

		&_form {
			padding: 0 40rpx;
		}
	}
</style>
